<template>
  <div class="addList">
    <div id="mws-container" class="clearfix">
      <div class="mws-panel grid_4">
        <div class="mws-panel-header">
          <span class="mws-i-24 i-list">新增问题</span>
        </div>
        <div class="mws-panel-body">
          <form class="mws-form" action="">
            <div class="mws-form-inline">
              <!--<div class="mws-form-row">-->
              <!--<label>Small text field</label>-->
              <!--<div class="mws-form-item small">-->
              <!--<input type="text" class="mws-textinput" />-->
              <!--</div>-->
              <!--</div>-->
              <!--<div class="mws-form-row">-->
              <!--<label>Medium text field</label>-->
              <!--<div class="mws-form-item medium">-->
              <!--<input type="text" class="mws-textinput" />-->
              <!--</div>-->
              <!--</div>-->
              <!--<div class="mws-form-row">-->
              <!--<label>Large text field</label>-->
              <!--<div class="mws-form-item large">-->
              <!--<input type="text" class="mws-textinput" />-->
              <!--</div>-->
              <!--</div>-->
              <div class="mws-form-row">
                <label>问题描述</label>
                <div class="mws-form-item large">
                  <textarea rows="100%" cols="100%" v-model="q_content"></textarea>
                </div>
              </div>
              <!--<div class="mws-form-row">-->
              <!--<label>当前状态</label>-->
              <!--<div class="mws-form-item small">-->
              <!--<select v-model="statusNow">-->
              <!--<option :value="item.id" v-for="(item,index) in status" v-text="item.val"></option>-->
              <!--</select>-->
              <!--</div>-->
              <!--</div>-->
              <div class="mws-form-row">
                <label>紧急程度</label>
                <div class="mws-form-item small">
                  <select v-model="levelNow">
                    <option :value="item.id" v-for="(item,index) in level" v-text="item.val"></option>
                  </select>
                </div>
              </div>
              <div class="mws-form-row">
                <label>问题分类</label>
                <div class="mws-form-item small">
                  <select v-model="classNow">
                    <option :value="item.id" v-for="(item,index) in qcList" v-text="item.q_class"></option>
                  </select>
                </div>
              </div>
            </div>
            <div class="mws-button-row">
              <input type="button" value="提交" class="mws-button green" @click="sendQ" />
            </div>
          </form>
        </div>
      </div>
      <div class="mws-panel grid_4">
        <div class="mws-panel-header">
          <span class="mws-i-24 i-list">新增分类</span>
        </div>
        <div class="mws-panel-body">
          <form class="mws-form" action="">
            <div class="mws-form-inline">
              <!--<div class="mws-form-row">-->
              <!--<label>Medium text field</label>-->
              <!--<div class="mws-form-item medium">-->
              <!--<input type="text" class="mws-textinput" />-->
              <!--</div>-->
              <!--</div>-->
              <!--<div class="mws-form-row">-->
              <!--<label>Large text field</label>-->
              <!--<div class="mws-form-item large">-->
              <!--<input type="text" class="mws-textinput" />-->
              <!--</div>-->
              <!--</div>-->
              <div class="mws-form-row">
                <label>新增分类</label>
                <div class="mws-form-item small">
                  <input type="text" class="mws-textinput" v-model="newClass" />
                </div>
              </div>
              <!--<div class="mws-form-row">-->
              <!--<label>当前状态</label>-->
              <!--<div class="mws-form-item small">-->
              <!--<select v-model="statusNow">-->
              <!--<option :value="item.id" v-for="(item,index) in status" v-text="item.val"></option>-->
              <!--</select>-->
              <!--</div>-->
              <!--</div>-->
            </div>
            <div class="mws-button-row">
              <input type="button" value="提交" class="mws-button green" @click="sendNewClass" />
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    name: 'addList',
    data() {
      return {
        baseUrl: 'http://47.95.200.225:80',
        // baseUrl: 'http://192.168.0.147:8000',
        user: [],
        // statusNow: '0',
        levelNow: '0',
        classNow: '1',
        newClass: '',
        removeId: '',
        // status: [
        //   {
        //     id: 0,
        //     val: '未修复'
        //   }, {
        //     id: 1,
        //     val: '修复中'
        //   }, {
        //     id: 2,
        //     val: '测试中'
        //   }, {
        //     id: 3,
        //     val: '修复完毕'
        //   },
        // ],
        q_content: '',
        qcList: [],
        level: [
          {
            id: 0,
            val: '可推迟'
          }, {
            id: 1,
            val: '优先修复'
          }, {
            id: 2,
            val: '紧急修复'
          }, {
            id: 3,
            val: '立刻修复'
          },
        ],
      }
    },
    methods: {
      getQClassList() {
        let self = this
        this.$ajax
          .get(self.baseUrl + '/qcList/')
          .then(function (res) {
            self.qcList = res.data
          })
          .catch(function (response) {
            // console.log(response)
          })
      },
      sendQ() {
        let self = this
        this.$ajax
          .get(self.baseUrl + '/addQ/?q_user=' + self.user.username + '&q_content=' + self.q_content + '&q_level=' + self.levelNow + '&q_class=' + self.classNow)
          .then(function (res) {
            if (res.data.status === 'ok') {
              alert(res.data.message)
            }
          })
          .catch(function (response) {
            // console.log(response)
          })
      },
      sendNewClass() {
        let self = this
        this.$ajax
          .get(self.baseUrl + '/addClassList/?q_class=' + self.newClass)
          .then(function (res) {
            if (res.data.status === 'ok') {
              alert(res.data.message)
              self.newClass = ''
              self.getQClassList()
            }
          })
          .catch(function (response) {
            // console.log(response)
          })
      },
    },
    mounted() {
      let self = this
      self.getQClassList()
      let login = sessionStorage.getItem('userDetail')
      if (login) {
        self.user = JSON.parse(login)
      } else {
        self.$router.push({path: '/login'})
      }
    },
  }
</script>

<style scoped>

</style>
